import React, {Component, PropTypes} from 'react';
import classNames from 'classnames';
import {splitObject} from '../../util/splitObject';
import {omit} from '../../util/omit';

const Dialog = require("rc-dialog");

const addEventListener = require("rc-util/lib/Dom/addEventListener");

const Button = require("../Button");

let mousePosition;
let mosePositionEventIned;

export default class Modal extends Component {

    static defaultProps = {
        prefixCls: 'fly-modal',
        width: 520,
        transitionName: 'zoom',
        maskTransitionName: 'fade',
        confirmLoading: false,
        visible: false,
    };

    static propTypes = {
        prefixCls: PropTypes.string,
        onOk: PropTypes.func,
        onCancel: PropTypes.func,
        okText: PropTypes.node,
        cancelText: PropTypes.node,
        width: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
        confirmLoading: PropTypes.bool,
        visible: PropTypes.bool,
        align: PropTypes.object,
        footer: PropTypes.node,
        title: PropTypes.node,
        closable: PropTypes.bool,
    };

    componentDidMount(){
        if(mosePositionEventIned){ return; }
 
        addEventListener(document.documentElement,"click",(e)=>{
            mousePosition = {
                x:e.pageX,
                y:e.pageY
            };

            setTimeout(()=>{mousePosition = null},100);
        });

        mosePositionEventIned = true;
    }

    onCancel = (e) =>{
        const {onCancel} = this.props;

        if(onCancel){ onCancel(e); }
    };

    onOk = ()=> {
        const {onOk} = this.props;

        if(onOk){ onOk(); }
    };


    render() {

        const {cancelText,okText,footer,visible} = this.props;

        const defaultFooter = [
            <Button
                key="cancel"
                type="blank"
                onClick={this.onCancel}
            >
                {cancelText || '取消'}
            </Button>,
            <Button
                key="confirm"
                type="primary"
                onClick={this.onOk}
            >
                {okText || '确定'}
            </Button>,
        ];

        return <Dialog
                onClose={this.onCancel}
                footer={footer || defaultFooter}
                {...this.props}
                visible={visible}
                mousePosition={mousePosition}
            />

    }
}